<template>
  <view>
    <view class="body">
      <view class="flex_item">
        <view class="flex_box" @click="goPage('dating')">
          <view class="iconfont icon-hezuo1 dating-icon icon-box text1"></view>
          <view class="cell-text">{{ $t('discover.make-friends') }}</view>
        </view>
        <view class="flex_box" @click="goPage('transaction')">
          <view class="iconfont icon-quan quan-icon icon-box text2"></view>
          <view class="cell-text">{{ $t('discover.exchange') }}</view>
        </view>
      </view>
      <view class="flex_item">
        <view class="flex_box" @click="goPage('reward')">
          <view class="iconfont icon-jifenguizeguankong offer-icon icon-box text1"></view>
          <view class="cell-text">{{ $t('discover.Offer-a-reward') }}</view>
        </view>
        <view class="flex_box" @click="goPage('information')">
          <view class="iconfont icon-xianzhi transaction-icon icon-box text2"></view>
          <!--  -->
          <view class="cell-text">{{ $t('discover.information') }}</view>
        </view>
      </view>
      <view class="flex_item">
        <view class="flex_box" @click="goPage('recruitment')">
          <view class="iconfont icon-gongwenbao recruitment-icon icon-box text1"></view>
          <view class="cell-text">{{ $t('discover.Recruitment') }}</view>
        </view>
        <view class="flex_box" @click="goshop">
          <image src="/static/image/user/mendian.png" mode="" style="width: 50rpx; height: 50rpx; margin-bottom: 15rpx"></image>
          <view class="cell-text">{{ $t('discover.shop') }}</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { queryChangeip } from '@/services/login';
export default {
  data() {
    return {};
  },
  methods: {
    goPage(val) {
      switch (val) {
        case 'dating':
          uni.navigateTo({
            url: '/pages/makefriends/MakeFriends'
          });
          break;
        case 'transaction':
          queryChangeip().then((res) => {
            uni.navigateTo({
              url: '/pagesUser/bourse/bourse'
            });
            // if (res.result.data === "中国") {
            //   uni.showToast({
            //     title: this.$t("newDeal.msg"),
            //     icon: "none",
            //   });
            // } else {
            //   uni.navigateTo({
            //     url: "/pagesUser/bourse/bourse",
            //   });
            // }
          });

          break;
        case 'recruitment':
          uni.navigateTo({
            url: '/pagesDiscover/recruitment/Recruitment'
          });
          break;
        case 'reward':
          uni.navigateTo({
            url: '/pagesDiscover/reward/Reward'
          });
          break;
        case 'information':
          uni.navigateTo({
            url: '/pagesDiscover/information/Information'
          });
          break;
        default:
          break;
      }
    },
    // 跳转到商铺
    goshop() {
      // TODO
      uni.navigateTo({
        url: '/sub_shop/shophome/shophome'
      });
    }
  }
};
</script>

<style>
page {
  background-color: #fff;
}
</style>
<style lang="scss" scoped>
.shop-icon {
  color: #795edd;
}

.dating-icon {
  color: #be75c1;
}

.offer-icon {
  color: #6ab2e5;
}

.transaction-icon {
  color: #69da94;
}

.recruitment-icon {
  color: #f5a527;
}

.activity-icon {
  color: #f1513c;
}

.leasing-icon {
  color: #68d5bf;
}

.quan-icon {
  color: #6ab2e5;
}
.text1 {
  font-size: 44rpx;
}
.text2 {
  font-size: 50rpx;
}
.icon-box {
  margin-bottom: 15rpx;
}
.body {
  width: 600rpx;
  margin: 100rpx auto 0;
  .flex_item {
    display: flex;
    justify-content: space-between;
    margin-bottom: 50rpx;
    .flex_box {
      width: 260rpx;
      height: 180rpx;
      background-color: #666ee8;
      border-radius: 20rpx;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      color: #fff;
      &:active {
        opacity: 0.8;
      }
    }
  }
}
</style>
